<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>邻助社区</title>
    <link rel="stylesheet" href="front/layui/css/layui.css" media="all" />
    <link rel="stylesheet" href="front/css/public.css" media="all" />
    <link rel="stylesheet" href="css/public.css" media="all" />
    <link rel="stylesheet" href="css/index.css" media="all" />
    <script type="text/javascript" src="front/layui/layui.js"></script>
</head>
<body>
<!-- 顶部导航 -->
<!--导航栏-->
<!--<script type="text/javascript" src="common/nav.js"></script>-->
<!--搜索-->
<div class='layui-bg-red' style='width: 100%'>
    <ul class='layui-nav nav_left' lay-filter=''>
        <li class='layui-nav-item'><a href='/news'>首页</a></li>
        <li class='layui-nav-item '>
            <a href='newslist.html?categoryId=1'>社区新闻</a>
        </li>
        <li class='layui-nav-item'><a href='newslist.html?categoryId=2'>社区帮助</a></li>
        <li class='layui-nav-item'><a href='newslist.html?categoryId=3'>社区风采</a></li>
        <li class='layui-nav-item'><a href='newslist.html?categoryId=4'>投稿专栏</a></li>
        <div class="search_container">
            <input class="layui-input search_article" type="text" placeholder="输入文章标题">
            <div class="result_container">
            </div>
        </div>
        <button type="button" class="layui-btn" style="margin-top: 15px">搜索</button>
    </ul>
    <ul class='layui-nav nav_right' lay-filter=''>
        <li class='layui-nav-item tologin'>
            <a href='admin?method=toLogin'>登录</a>
        </li>
        <li class='layui-nav-item has-login'>
            <a href='javascript:;' class='username'></a>
            <dl class='layui-nav-child'> <!-- 二级菜单 -->
                <dd><a id='logout'>注销</a></dd>
                <dd><a href='postNewsDetail.html' id='post'>投稿</a></dd>
            </dl>
        </li>
    </ul>
</div>
<!--轮播图start-->
    <div class="layui-carousel" id="test1">
        <div carousel-item>
            <div class="carousel-item"><img src="/news/upload/aaa.png" width="10px"></div>
<!--            <div class="carousel-item"><img src="https://www.gdpu.edu.cn/tp/79.jpg"></div>-->
<!--            <div class="carousel-item"><img src="https://www.gdpu.edu.cn/tp/73.jpg"></div>-->
<!--            <div class="carousel-item"><img src="https://www.gdpu.edu.cn/tp/74.jpg"></div>-->
        </div>
    </div>
<!--轮播图end-->
    <div class="layui-container">
        <div class="layui-row">
            <div class="layui-col-md6 left">

                <div class="news-list-title" >
                    <dt><a href="newslist.html?categoryId=1">社区新闻</a></dt>
                    <dl><a href="newslist.html?categoryId=1">更多>>></a></dl>
                </div>
                <div class="ulbox" id="1">
                    <ul></ul>
                </div>
            </div>
            <!-- 新闻纵横-->
            <div class="layui-col-md6 right">
                <div class="news-list-title" >
                    <dt><a href="newslist.html?categoryId=2">社区帮助</a></dt>
                    <dl><a href="newslist.html?categoryId=2">更多>>></a></dl>
                </div>
                <div class="ulbox" id="2">
                    <ul></ul>
                </div>
            </div>
        </div>

        <div class="layui-row row">
            <div class="layui-col-md6 left">

                <div class="news-list-title" >
                    <dt><a href="newslist.html?categoryId=3">社区风采</a></dt>
                    <dl><a href="newslist.html?categoryId=3">更多>>></a></dl>
                </div>
                <div class="ulbox" id="3">
                    <ul></ul>
                </div>
            </div>
            <!-- 新闻纵横-->
            <div class="layui-col-md6 right">
                <div class="news-list-title" >
                    <dt><a href="newslist.html?categoryId=4">投稿专栏</a></dt>
                    <dl><a href="newslist.html?categoryId=4">更多>>></a></dl>
                </div>
                <div class="ulbox" id="4">
                    <ul></ul>
                </div>
            </div>
        </div>
    </div>
</body>

<script type="text/javascript" src="/news/front/js/api.js"></script>
<script type="text/javascript" src="front/js/common.js"></script>
<script type="text/javascript" src="common/public.js"></script>
</html>

<script>
    var param = getRequest();
    layui.use(['layer','element','carousel'],function(){
        var element = layui.element;
        var carousel = layui.carousel;
        var $ = layui.jquery;
        var categorys = [1,2,3,4]
        // 用户名
        getArticle(categorys);
        // 获取列表
        load_data()
        function getArticle(categorys){
            for (const index in categorys) {
                $.ajax({
                    url:API_BASE_URL+'/article?method=getArticleListByCatelogyId&categoryId='+categorys[index],
                    method:"GET",
                    contentType: "application/json;charset=utf-8",
                    dataType: "json",
                    cache:true,
                    success(res){
                        console.log(res.data)
                        if (res.code == 200){
                            let count = 0;
                            for (let item in res.data.articleList){
                                let obj = res.data.articleList[''+item+''];
                                $("#"+categorys[index]).find("ul")
                                    .append('<li >'+'<a href="content.html?id='+ obj.id +'">'+ obj.title +'</a>'+
                                '<p>'+ obj.createTimeStr +'</p></li>');
                                count++;
                                if (count == 5){
                                    break;
                                }
                            }
                        }
                    }
                })
            }
        }
        carousel.render({
            elem: '#test1'
            ,width: '100%' //设置容器宽度
            ,arrow: 'always' //始终显示箭头
            ,height:'460px'
            ,interval: 5000
            //,anim: 'updown' //切换动画方式
        });
    })
</script>